import { useEffect,useRef } from 'react'
const { remote } = window.require('electron')
const { Menu, MenuItem } = remote

const useContextMenu = (itemArr,targetSelector) => {      //传入一个数组 返回一个组件
    let ClickedElement=useRef(null)
    useEffect(() => {
        const menu = new Menu()
        itemArr.forEach(item => {
            menu.append(new MenuItem(item))
        })
        const handleContextMenu = (e) => {
            if(document.querySelector(targetSelector).contains(e.target)){   //获取传递进来class 点击右键的时候是否在文件列表上 才显示右键菜单
                ClickedElement.current=e.target  //记住当前点击的是那个元素
                menu.popup({ window: remote.getCurrentWindow() })
            }
        }
        window.addEventListener('contextmenu', handleContextMenu)
        return () => {
            window.removeEventListener('contextmenu', handleContextMenu)
        }
    })
    return ClickedElement
}

export default useContextMenu